﻿<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
    CodeFile="Details.aspx.cs" Inherits="Details" Title="Untitled Page" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div id="details">
        <div class="details_l">
            <div class="de_img">
                <div>
                    <div style="position: relative;">
                        <a class="jqzoom" id="product_img_a" title="" style="outline-style: none; text-decoration: none;
                            cursor: crosshair; display: block; position: relative; height: 370px; width: 370px;"
                            href="images/s5_big.jpg">
                            <img title="" src="images/s5_small.jpg" alt="Erina" id="product_img" height="370"
                                width="370"></a>
                    </div>
                </div>
            </div>
            <div class="clear">
            </div>
            <div class="img_buttom">

                <script language="javascript" type="text/javascript">			
													
									var additionalimg6333 = new Array("images/s4.jpg","54","35","images/s4_big.jpg","370","370","images/s5.jpg","54","35","images/s5_big.jpg","370","370","images/s6.jpg","54","35","images/s6_big.jpg","370","370");
																										
				var colorWidthArr = new Array('370','370');
				var colorHeightArr = new Array('370','370');

                </script>

                <script type="text/javascript" language="JavaScript1.2" src="js_details/product.txt"></script>

                <div id="" style="float: left; vertical-align: bottom; width: 370px;">
                    <div class="elastislide1-carousel1" style="border: 1px solid #ccc; margin-top: 5px;">
                        <ul style="transition: all 0s ease 0s; display: block; max-height: 40px;" id="carousel1"
                            class="elastislide1-list1">
                            <li>
                                <div id="rollover" style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,0);">
                                        <img src="images/s4.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,1);">
                                        <img src="images/s5.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,2);">
                                        <img src="images/s6.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div id="rollover" style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,0);">
                                        <img src="images/s4.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,1);">
                                        <img src="images/s5.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,2);">
                                        <img src="images/s6.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div id="rollover" style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,0);">
                                        <img src="images/s4.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div id="rollover" style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,0);">
                                        <img src="images/s4.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div style="float: left; width: 50px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,2);">
                                        <img src="images/s6.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                            <li>
                                <div id="rollover" style="float: left; width: 54px; height: 35px" class="img">
                                    <a href="javascript:%20toggleAdditionalImg(6333,0);">
                                        <img src="images/s4.jpg" height="50" width="35"></a>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <!-- slide click next/pre hình nhỏ  -->

                    <script type="text/javascript" src="js_details/jquery_002.js"></script>

                    <link rel="stylesheet" type="text/css" href="js_details/custom_details.css">

                    <script src="js_details/modernizr.js"></script>

                    <!-- end slide click next/pre hình nhỏ  -->

                    <script type="text/javascript" src="js_details/jquery_details.js"></script>

                    <script type="text/javascript">
			
			$( '#carousel1' ).elastislide1();
			
                    </script>

                </div>
            </div>
        </div>
        <div class="details_r">
            <p class="pro_name">
                PRODUCT NAME</p>
            <p class="des1">
                For troubleshooting, feature requests, and general help, contact Customer Support
                at Mail. Make sure to include details on your browser, operating system, WOW Slider
                version, link to your page.<br />
                In most cases you'll get a reply within 1 business day. Please read the FAQs first
                to see if your question has already been answered.
            </p>
            <p class="price">
                Our Price: <strong>$57.95</strong>
            </p>
            <p class="rrp">
                RRP: $108.95<span>Save: 47%</span></p>
            <p class="delivery">
                <a class="Free_Delivery" href="#">Free Delivery</a></p>
            <p>
                <a class="bt_buy" href="#">BUY NOW</a></p>
        </div>
    </div>
</asp:Content>
